// 收款核算
<template>
  <div>
    <el-dialog class="con-dialog" :class="isInfo ? 'margin-top-60' : ''" title="滞纳金减免申请" :visible.sync="dialogShow" :modal="isInfo ? false : true" :fullscreen="isInfo ? true : false" width="90%" :close-on-click-modal="false" :close-on-press-escape="false">
      <el-table class="new-table-style bold-scrollbar-table cost-box bold-scrollbar-table" :border="true" :data="tableData" align="left">
        <el-table-column align="center" label="序号">
          <template slot-scope="scope">
            <span>{{ scope.$index + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column align="left" label="客户" width="130" prop="customerName"></el-table-column>
        <el-table-column align="left" label="费项名称" width="130" prop="bizTypeName"></el-table-column>
        <el-table-column align="left" label="资产编号" width="130" prop="chargeItemCode"></el-table-column>
        <el-table-column align="center" label="应缴日期" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.paymentDeadline | formatDateTime('YYYY-MM-DD') }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="计费开始日期" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.cycleStartTime | formatDateTime('YYYY-MM-DD') }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="计费结束日期" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.cycleEndTime | formatDateTime('YYYY-MM-DD') }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="总金额" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.amountReceivable | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="已结金额" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.amountReceived | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="未结金额" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.unPaymentAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="逾期天数" prop="overdueDays" class-name="no-padding" min-width="120"></el-table-column>
        <el-table-column align="center" label="应缴滞纳金" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.lateFeesReceivable | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="申请减免滞纳金" class-name="no-padding" min-width="140">
          <template slot-scope="scope">
            <el-input-number :controls="false" :min="0" :disabled="isInfo ? true : false" class="no-border-input" v-model="scope.row.lateFeesReduction" @blur="validateNum(scope.row)" placeholder="请输入"></el-input-number>
          </template>
        </el-table-column>
        <el-table-column align="center" label="操作" class-name="no-padding" min-width="120" v-if="!isInfo">
          <template slot-scope="scope">
            <el-button type="text" class="color-red" @click="deleteFn(scope.$index)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>

      <div class="font-size-17 font-weight-700 padding-top-40 padding-bottom-20">减免信息</div>
      <form-common :filed-list="formList" ref="form" :formObj="formObj"></form-common>

      <div class="padding-top-20 padding-bottom-20 font-size-17 font-weight-700">附件信息</div>
      <upload-file v-if="!isInfo" :multiple="false" class="upload-box" :limit="10" tip="" :max-size="100" accept=".xlsx,.xls,.csv,.png,.jpg,.Png,.Jpg,.pdf" :fileList.sync="fileList"> </upload-file>
      <div v-else>
        <el-link class="padding-right-20" type="primary" v-for="item in formObj.attachmentList" :key="item.primaryKey" @click="uploadLoad(item.fileUrl)">{{ item.fileTitle }}</el-link>
      </div>

      <div slot="footer" class="dialog-footer" v-if="!isInfo">
        <el-button @click="dialogShow = false">取 消</el-button>
        <el-button type="primary" @click="confirmFn">提 审</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import { lateFeeList } from '../../../assets/form';
  import formCommon from '@g/components/form/formCommon.vue';
  import { apiLateFeeAdd, apiLateFeeInfo } from '../../../api/billManage';
  import { requestTips, askDialog, uploadLoad } from '@/common/js/utils';
  import { apiCreateAudit } from '@a/index';
  import $ from 'jquery';

  export default {
    name: 'gatherAdjust',

    props: {
      checkList: {
        type: Array,
        default: () => {
          return [];
        },
      },
      isInfo: {
        type: Boolean,
        default: false,
      },
    },

    data() {
      return {
        dialogShow: false,
        formList: lateFeeList,
        formObj: {},
        tableData: [],
        fileList: [],
        userInfo: JSON.parse(localStorage.getItem('userInfo')),
      };
    },

    methods: {
      init() {
        this.dialogShow = true;
        this.getInfo();
        if (!this.isInfo) {
          this.initFormData();
        }
        if (this.isInfo) {
          this.initDomSetting();
          this.banForm();
        }
      },

      async getInfo() {
        let billKeys = this.checkList.map(item => {
          return item.primaryKey;
        });
        let params = {};
        if (this.isInfo) {
          params = { workId: this.$route.query.processWorkId };
        } else {
          params = { billKeys: billKeys };
        }
        let res = await apiLateFeeInfo(params);
        if (this.isInfo) {
          this.formObj = res;
        }
        this.tableData = res.billList || [];
      },

      deleteFn(index) {
        this.tableData.splice(index, 1);
      },

      confirmFn() {
        if (this.tableData.length == 0) {
          this.$message.warning('账单为空！！');
          return;
        }

        for (let i = 0, len = this.tableData.length; i < len; i++) {
          if (!this.tableData[i].lateFeesReceivable || this.tableData[i].lateFeesReceivable == 0) {
            this.$message.warning('第' + (i + 1) + '条账单应缴滞纳金为0,无法申请减免');
            return;
          }
        }

        let model = this.$refs.form.validateForm(); //基本信息
        if (!model) return;

        let validateMustCost = this.validateMustCost();
        if (!validateMustCost) {
          this.$message.warning('请输入减免金额！');
          return;
        }

        askDialog('确认提交？', async () => {
          model.billList = this.tableData;
          let attachmentList = [];
          this.fileList.forEach(item => {
            attachmentList.push({ fileTitle: item.name, fileUrl: item.response.data.rows[0].sourceUrl, fileId: item.response.data.rows[0].key });
          });
          model.attachmentList = attachmentList;
          let res = await apiLateFeeAdd(model);
          if (res.success) {
            this.submitFn(res.key);
          } else {
            this.$message.error(res.message);
          }
        });
      },

      //提审
      async submitFn(key) {
        let projectKey = localStorage.getItem('projectKey');
        let param = {
          businessKey: key,
          userPrimaryKey: this.userInfo.key,
          projectKey: projectKey,
          type: '滞纳金减免',
          typeKey: 'lateFeesReduction',
        };
        let res = await apiCreateAudit(param);
        requestTips(res, () => {
          this.dialogShow = false;
          this.$emit('confirmLateFee');
        });
      },

      //校验合同费用约定的必填
      validateMustCost() {
        for (let i = 0, len = $('.cost-box').find('.el-input__inner').length; i < len; i++) {
          let item = $('.cost-box').find('.el-input__inner')[i];
          if ($(item).val() == '') {
            $(item).css('border', '1px solid red');
            return false;
          } else {
            $(item).css('border', 'none');
          }
        }
        return true;
      },

      //申请减免滞纳金不能比应缴滞纳金大
      validateNum(row) {
        if (row.lateFeesReduction > row.lateFeesReceivable) {
          row.lateFeesReduction = row.lateFeesReceivable;
        }
      },

      initFormData() {
        this.$set(this.formObj, 'applyDate', new Date().getTime());
      },

      //详情时初始化dom
      initDomSetting() {
        $('.con-dialog .el-dialog__header').hide();
      },

      //禁止form必填 可输入
      banForm() {
        this.formList.forEach(item => {
          item.isRequired = false;
          item.isDisabled = true;
        });
      },
    },

    components: { formCommon },
  };
</script>

<style lang="scss" scoped>
  ::v-deep .el-form-item__label {
    padding: 0;
  }
  .cost-box {
    ::v-deep .el-input.is-disabled .el-input__inner {
      background-color: #fff;
      border-color: #fff;
      color: #333;
      font-size: 16px;
    }
  }
</style>
